<h2>人员登记系统</h2>
<div class="people_list">
  <ul>
    <li>姓名：<input type="text" [(ngModel)]="peopleInfo.userName" class="user-name"></li>
    <li>性别：
      <input type="radio" value="1" name="sex" id="sex1" [(ngModel)]="peopleInfo.sex"> <label for="sex1">男</label>
      <input type="radio" value="2" name="sex" id="sex2" [(ngModel)]="peopleInfo.sex"> <label for="sex2">女</label>
    </li>
    <li>居住城市：
      <select name="city" id="city" [(ngModel)]="peopleInfo.city">
        <option [value]="item" *ngFor="let item of peopleInfo.cityList">{{item}}</option>
      </select>
    </li>
    <li>爱好：
      <span *ngFor="let item of peopleInfo.hobby;let key = index">
        <input type="checkbox" [id]="'check'+key" [(ngModel)]="item.checked" />  <label [for]="'check'+key">{{item.title}}</label>
        &nbsp;&nbsp;
      </span>
    </li>
    <li>备注：
      <textarea name="mark" id="mark" cols="30" rows="10" [(ngModel)]="peopleInfo.mark"></textarea>
    </li>
  </ul>
  <br>
  <br>
  <br>
  <br>
  <br>
  <br>
  <button (click)="doSubmit()">获取表单组件</button>
</div>
